import React from 'react';
import { View, Text } from 'react-native';

// 定义子组件接收的props类型
interface ChildProps {
  color: string;
  name: string;
}

// 父组件
export default function App() {
  return (
    <View>
      <Text>========</Text>
      {/* 1.父组件开始传递 */}
      <Child color='red' name='小白' />
      <Text>--------</Text>
    </View>
  );
}

// 2.子组件接收 解构
function Child({ color, name }: ChildProps) {
  return (
    <View>
      <Text>子组件</Text>
      {/* 3.子组件通过props 使用 */}
      <Text style={{ color: color }}>姓名：{name}</Text>
    </View>
  );
}

// function Child(props: ChildProps) {
//   return (
//     <View>
//       <Text>子组件</Text>
//       {/* 3.子组件通过props 使用 */}
//       <Text style={{ color: props.color }}>姓名：{props.name}</Text>
//     </View>
//   );
// }




